<template>
  <a-form layout="horizontal" :form="form" class="form" >
    <a-row :gutter="8">
      <a-col :md="8" :sm="24">
        <a-form-item label="功能ID" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input
            disabled
            v-decorator="[
              'funcId',
              {rules: [{ required: false, message: '请输入功能ID', whitespace: true}]}
            ]"
            placeholder=""
          />
        </a-form-item>
      </a-col>
      <a-col :md="8" :sm="24">
        <a-form-item label="功能标题" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input
            placeholder=""
            v-decorator="[
              'funcTitle',
              {rules: [{ required: false, message: '请输入功能标题', whitespace: true}]}
            ]"/>
        </a-form-item>
      </a-col>
      <a-col :md="8" :sm="24">
        <a-form-item label="节点类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-select
            placeholder="请选择"
            allowClear
            disabled
            v-decorator="[
              'nodeType',
              {rules: [{ required: true, message: '请输入节点类型', whitespace: true}]}
            ]"
          >
            <a-select-option value="0">节点</a-select-option>
            <a-select-option value="1">叶子</a-select-option>
          </a-select>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :md="8" :sm="24">
        <a-form-item label="功能类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-select
            placeholder="请选择"
            disabled
            allowClear
            v-decorator="[
              'funcType',
              {rules: [{ required: false, message: '请输入功能类型', whitespace: true}]}
            ]"
          >
            <a-select-option value="query">查询</a-select-option>
            <a-select-option value="edit">编辑</a-select-option>
            <a-select-option value="insert">新增</a-select-option>
            <a-select-option value="update">修改</a-select-option>
            <a-select-option value="delete">删除</a-select-option>
            <a-select-option value="upload">上传</a-select-option>
            <a-select-option value="download">下载</a-select-option>
            <a-select-option value="print">打印</a-select-option>
            <a-select-option value="rollback">回退</a-select-option>
            <a-select-option value="auth">审核</a-select-option>
            <a-select-option value="other">其他</a-select-option>
          </a-select>
        </a-form-item>
      </a-col>
      <a-col :md="8" :sm="24">
        <a-form-item label="父功能标题" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input
            disabled
            placeholder=""
            v-decorator="[
              'parentTitle',
              {rules: [{ required: false, message: '请输入父功能标题', whitespace: true}]}
            ]"/>
        </a-form-item>
      </a-col>
      <a-col :md="8" :sm="24">
        <a-form-item label="状态" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-select
            placeholder="请选择"
            allowClear
            v-decorator="[
              'status',
              {rules: [{ required: true, message: '请输入状态', whitespace: true}], initialValue: this.initData.status}
            ]"
          >
            <a-select-option value="0">禁用</a-select-option>
            <a-select-option value="1">启用</a-select-option>
          </a-select>
        </a-form-item>
      </a-col>
    </a-row>
    
    <a-row :gutter="8">
      <a-col :md="24" :sm="24">
        <a-form-item label="所属类名" :labelCol="{sm: { span: 24 },md: { span: 3 }}" :wrapperCol="{sm: { span: 24 },md: { span: 21 }}">
          <a-input
            disabled
            v-decorator="[
              'classPath',
              {rules: [{ required: false, message: '类路径不能为空', whitespace: true}]}
            ]"
            placeholder=""
          />
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :md="8" :sm="24">
        <a-form-item label="功能方法" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input
            placeholder=""
            v-decorator="[
              'method',
              {rules: [{ required: false, message: '请输入功能方法', whitespace: true}]}
            ]"/>
        </a-form-item>
      </a-col>
      <a-col :md="8" :sm="24">
        <a-form-item label="功能编号" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input
            placeholder=""
            v-decorator="[
              'funcCode',
              {rules: [{ required: false, message: '请输入功能编号', whitespace: true}]}
            ]"/>
        </a-form-item>
      </a-col>
      <a-col :md="8" :sm="24">
        <a-form-item label="是否公共" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-select
            placeholder="请选择"
            allowClear
            v-decorator="[
              'publicFlag',
              {rules: [{ required: true, message: '请输入是否公共', whitespace: true}], initialValue: this.initData.status}
            ]"
          >
            <a-select-option value="0">否</a-select-option>
            <a-select-option value="1">是</a-select-option>
          </a-select>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :md="8" :sm="24">
        <a-form-item label="操作期" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-select
            placeholder="请选择"
            allowClear
            v-decorator="[
              'operating',
              {rules: [{ required: false, message: '请输入操作期', whitespace: true}]}
            ]"
          >
            <a-select-option v-for="item in dictData.operating" :key="item.dictKey" :value="item.dictKey">{{ item.dictValue }}</a-select-option>
          </a-select>
        </a-form-item>
      </a-col>
      <a-col :md="8" :sm="24">
        <a-form-item label="流程节点类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-select
            placeholder="请选择"
            allowClear
            v-decorator="[
              'auType',
              {rules: [{ required: false, message: '请输入流程节点类型', whitespace: true}]}
            ]"
          >
            <a-select-option v-for="item in dictData.auType" :key="item.dictKey" :value="item.dictKey">{{ item.dictValue }}</a-select-option>
          </a-select>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :md="6" :sm="12">
        <a-form-item label="可回退" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
          <a-switch checkedChildren="是" unCheckedChildren="否" v-decorator="['rollbackFlag', { valuePropName: 'checked'}]" />
        </a-form-item>
      </a-col>
      <a-col :md="6" :sm="12">
        <a-form-item label="跨业务期回退" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
          <a-switch checkedChildren="是" unCheckedChildren="否" v-decorator="['spanRollbackFlag', { valuePropName: 'checked'}]" />
        </a-form-item>
      </a-col>
      <a-col :md="6" :sm="12">
        <a-form-item label="是否开启流程" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
          <a-switch checkedChildren="是" unCheckedChildren="否" v-decorator="['auditFlag', { valuePropName: 'checked'}]" />
        </a-form-item>
      </a-col>
      <a-col :md="6" :sm="12">
        <a-form-item label="记日志" :labelCol="labelCol1" :wrapperCol="wrapperCol1">
          <a-switch checkedChildren="是" unCheckedChildren="否" v-decorator="['logFlag', {valuePropName: 'checked'}]" />
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :md="24" :sm="24">
        <a-form-item label="摘要信息" :labelCol="{sm: { span: 24 },md: { span: 3 }}" :wrapperCol="{sm: { span: 24 },md: { span: 21 }}">
          <a-textarea
            placeholder="JSONArray格式，操作日志使用，优先使用功能里的摘要，为空则使用路由里的摘要"
            :rows="4"
            v-decorator="[
              'remarks',
              {rules: [{ required: false, message: '请输入备注', whitespace: true}]}
            ]"
          />
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8" :style="{display:'none'}">
      <a-col :md="24" :sm="24">
        <a-form-item label="接口API" :labelCol="{sm: { span: 24 },md: { span: 3 }}" :wrapperCol="{sm: { span: 24 },md: { span: 21 }}">
          <a-input
            disabled
            v-decorator="[
              'api',
              {rules: [{ required: false, message: '接口API不能为空', whitespace: true}]}
            ]"
            placeholder=""
          />
        </a-form-item>
      </a-col>
      <a-col :md="8" :sm="24">
        <a-form-item label="父功能ID" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input
            disabled
            placeholder=""
            v-decorator="[
              'parentId',
              {rules: [{ required: false, message: '请输入父功能ID', whitespace: true}]}
            ]"/>
        </a-form-item>
      </a-col>
      <a-col :md="8" :sm="24">
        <a-form-item label="排序" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input-number
            disabled
            style="width: 100%"
            v-decorator="[
              'orderNo',
              {rules: [{ type: 'number', required: false, message: '请输入排序', whitespace: true}]}
            ]"/>
        </a-form-item>
      </a-col>
      <a-col :md="8" :sm="24">
        <a-form-item label="级别" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input-number
            disabled
            style="width: 100%"
            v-decorator="[
              'rate',
              {rules: [{ type: 'number', required: false, message: '请输入级别', whitespace: true}]}
            ]"/>
        </a-form-item>
      </a-col>
    </a-row>
  </a-form>
</template>

<script>
import { getBatchDict } from "@/services/system/api"
import moment from 'moment'
export default {
  data () {
    return {
      hideChecked: false,
      labelCol: {
        xs: { span: 24 },
        sm: { span: 9 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 15 }
      },
      labelCol1: {
        xs: { span: 24 },
        sm: { span: 12 }
      },
      wrapperCol1: {
        xs: { span: 24 },
        sm: { span: 12 }
      },
      confirmLoading: false,
      dictData: {},
      form: this.$form.createForm(this),
      initData: {}
    }
  },
  created () {
   // 数据初始化
    const params = {}
    params.dictFields = 'auType,operating'
    this.$http.post(getBatchDict,params).then(res => {
      this.dictData = res.result
    })
  },
  methods: {
    moment,
    setInitDate (functionInfo) {
      this.form.resetFields()
      if (functionInfo) {
        delete functionInfo.nodeTypeName
        delete functionInfo.publicFlagName
        delete functionInfo.statusName
        delete functionInfo.funcName
        delete functionInfo.opRouterId
        delete functionInfo.opOplogId
        delete functionInfo.opFuncId
        delete functionInfo.accessToken
        delete functionInfo.reqIp
        delete functionInfo.pageNum
        delete functionInfo.pageSize
        if (functionInfo.logFlag === '1') {
          functionInfo.logFlag = true
        } else {
          functionInfo.logFlag = false
        }
        if (functionInfo.rollbackFlag === '1') {
          functionInfo.rollbackFlag = true
        } else {
          functionInfo.rollbackFlag = false
        }
        if (functionInfo.auditFlag === '1') {
          functionInfo.auditFlag = true
        } else {
          functionInfo.auditFlag = false
        }
        if (functionInfo.spanRollbackFlag === '1') {
          functionInfo.spanRollbackFlag = true
        } else {
          functionInfo.spanRollbackFlag = false
        }
        this.form.setFieldsValue(functionInfo)
      }
    },
    onSearchFuncCodeSelectTree () {
      console.log(...arguments)
    },
    onSelectFuncCodeSelectTree () {
      console.log(...arguments)
    }
  }
}
</script>
